<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <div>
        event loop它的执行顺序：
            一开始整个脚本作为一个宏任务执行
            执行过程中同步代码直接执行，宏任务进入宏任务队列，微任务进入微任务队列
            当前宏任务执行完出队，检查微任务列表，有则依次执行，直到全部执行完
            执行浏览器UI线程的渲染工作
            检查是否有Web Worker任务，有则执行
            执行完本轮的宏任务，回到2，依此循环，直到宏任务和微任务队列都为空

            微任务包括：MutationObserver、Promise.then()或catch()、Promise为基础开发的其它技术，比如fetch API、V8的垃圾回收过程、Node独有的process.nextTick。
            宏任务包括：script 、setTimeout、setInterval 、setImmediate 、I/O 、UI rendering。
            注意⚠️：在所有任务开始的时候，由于宏任务中包括了script，所以浏览器会先执行一个宏任务，在这个过程中你看到的延迟任务(例如setTimeout)将被放到下一轮宏任务中来执行。

            作者：LinDaiDai_霖呆呆
            链接：https://juejin.im/post/5e58c618e51d4526ed66b5cf
            来源：掘金
            著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。
    </div>
    <script>
        async function async1(){
            console.log('async1 start');
            await async2();
            console.log('async1 end')
        }
        async function async2(){
            console.log('async2')
        }
        console.log('script start')
        setTimeout(function(){
            console.log('setTimeout')
        },0)
        async1()
        new Promise(function(resolve){
            console.log('promise1');
            resolve();
        }).then(function(){
            console.log('promise2');
        })
        console.log('script end')
    </script>
    1.浏览器是多线程的
        JS是单线程 => 浏览器只给了其中一个线程来渲染；
</body>
</html>